<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<style>
    html, body{
        height: 100%; width: 100%; padding: 0;
    }
    body{
        background: url('/Public/game/images/ep02/back2.jpg') center no-repeat; background-size: 100% 100%;
    }
    #main {
        display: flex; flex-direction: row; align-items: center;justify-content: center; height: 100%;
        -webkit-user-select: none; /* Safari */
        -ms-user-select: none; /* IE 10 and IE 11 */
        user-select: none; /* Standard syntax */
    }
    iframe{
       height: 100vh;width: 100vh;border:none;
    }

    #main {
        display: flex; flex-direction: column; align-items: center;justify-content: center; height: 100%;;
    }
    h1 {
        font-size: 3rem;
    }
    input {
        font-size: 5rem;height:10vh;width: 50vh;margin-top: 5vh;border:5px solid black;text-align: center;line-height: 4rem;
    }
</style>
<body>
    <div id="main">
        <iframe src=""></iframe>
    </div>
</body>
<script>
    console.log(window.location.href);
    function getUrlParams(url) {
        const searchParams = new URLSearchParams(url.split('?')[1]);
        const params = {};
        for (const [key, value] of searchParams.entries()) {
            params[key] = value;
        }
        return params;
    }
    let params = getUrlParams(window.location.href);
    $('iframe').attr('src','/Home/Trial/checkbox?id=' + params.id)
    function getData(){
        $.ajax({
            url:'/Home/Trial/get_data?id=' + params.id,
            type:'get',
            success:function(res){
                if(res.data.status == 'clue'){
                    window.location.href = '/Home/Trial/clue?id=' + params.id
                }
                if(res.data.status == 'index'){
                    window.location.href = '/Home/Trial/index?id=' + params.id
                }
                if(res.data.status == 'win'){
                    $("#iframe").hide();
                    $("#main").html("<h1>恭喜你完成挑战任务，线索生成中，请稍等</h1>");
                }
            }
        })
    }
    setInterval(()=>{
        getData()
    },1000)
</script>
</html>